<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<html class="not-ie" lang="en"> <!--<![endif]-->
    <head>
        <!-- Basic Meta Tags -->
        <meta charset="utf-8">
        <title>Ecommerce</title>
        <meta name="description" content="your description">
        <meta name="keywords" content="your keywords">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <!-- Favicon -->
        <link href="img/favicon.png" rel="icon" type="image/png">
        <!-- Bootstrap css -->
        <link href="css/bootstrap.min.css" rel="stylesheet">  
        <!-- Flexslider css -->
        <link href="css/flexslider.css" rel="stylesheet">
        <!-- Nivo slider css -->
        <link href="css/nivo-slider.css" rel="stylesheet">
        <!-- Pretty Photo -->
        <link href="css/prettyPhoto.css" rel="stylesheet">  
        <!-- Font Awesome css -->
        <link href="css/font-awesome.min.css" rel="stylesheet">
        <!-- Custom Scrollbar css -->
        <link href="css/jquery.mCustomScrollbar.css" rel="stylesheet" />
        <!-- Animate css -->    
        <link href="css/animate.css" rel="stylesheet">
        <!-- Refine slider -->
        <link href="css/refineslide.css" rel="stylesheet">  
        <!-- Theme css -->    
        <link href="css/style.css" rel="stylesheet" id="bg">   
        <!-- Default color css -->
        <link href="css/colors/blue.css" rel="stylesheet" id="color">
        <!-- Bootstrap override css -->               
        <link href="css/bootstrap-override.css" rel="stylesheet">

        <!-- Google Fonts -->
        <link href='http://fonts.googleapis.com/css?family=Asap:400,700,400italic,700italic&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css'>

        <!-- Internet Explorer condition - HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
                <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->   

    </head>       
    <body>
        <!-- Header -->
        <header id="header">
            <c:if test="${!empty usuario.nome}">
                nao ta logado
            </c:if>
            <div class="container">   
                <div class="row spacer40"></div>    
                <div class="row">
                    <div class="span12">
                        <div class="head-info">
                            Telefone: (xxx) xxxx xxxx
                            <div class="money">            
                                <a href="#" class="shop-header-links">Minha Conta</a>
                            </div>  
                        </div>        
                    </div>
                </div>
                <div class="row spacer40"></div>
                <div class="row">
                    <div class="span8">
                        <div class="logo"> <!-- Logo -->
                            <a href="index.jsp"><div class="logo-picture"></div></a> <!-- Logo link and logo image -->
                            <div class="logo-text"><span class="color-dark"><u>Ecommerce</u></span></div> <!-- text next to logo -->
                        </div>            
                    </div>
                    <c:if test="${empty usuario.nome}">
                        <!-- essa parte pega os dados da quantidade de produtos que o cliente comprou e exibe no carrinho de compras...
                             so mostra se o usuario estiver logado -->
                        <div class="span4 pull-right">
                            <div class="shop-cart-header">
                                <div class="shop-cart-header-text">35 $<br>
                                    <span class="shop-cart-header-text-2">4 items</span></div>
                                <div class="shop-cart-header-logo"><a href="checkout.jsp"><i class="icon-shopping-cart"></i></a></div>
                            </div>
                        </div>
                    </c:if>
                </div>   
                <div class="row">
                    <div class="span12">
                        <!-- Main navigation -->
                        <nav class="navbar">
                            <ul class="nav pull-right" id="nav">
                                <li class="active"><a href="index.jsp" title="Home">Inicio</a></li>
                                <li><a href="shop.jsp" title="Shop">Shows</a>
                                    <c:if test="${empty usuario.nome}">
                                        <!-- Sub menu -->
                                        <ul>
                                            <li><a href="checkout.jsp" title="Checkout">Carrinho</a></li>
                                            <li><a href="#" title="Checkout">Alterar</a></li>
                                            <li><a href="#" title="Checkout">Cadastrar</a></li>
                                            <li><a href="#" title="Checkout">Pesquisar</a></li>
                                        </ul>
                                        <!-- Sub menu end-->            
                                    </c:if>
                                </li>

                                <li><a href="shop.jsp" title="Shop">Cliente</a>
                                    <ul>
                                        <li><a href="#" title="Checkout">Alterar</a></li>
                                        <li><a href="#" title="Checkout">Cadastrar</a></li>
                                        <li><a href="#" title="Checkout">Pesquisar</a></li>
                                    </ul>
                                </li>

                                <li><a href="#" title="Contact">Contato</a></li>
                            </ul>
                        </nav><!-- Main navigation end-->
                    </div>
                </div>
        </header>

        <section id="section">
            <div class="container">
                <div class="row">
                    <div class="span12">
                        <ul class="rs-slider">
                            <li >
                                <a href="#">
                                    <img src="img/shop-item-6.jpg" alt="" />
                                </a>
                                <div class="rs-caption rs-bottom">
                                    <h3>Mirian Lopes</h3>
                                    <p>Random text <a href="http://www.entiri.com/" class="button"> with link.</a></p>
                                </div>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="img/team-2.jpg" alt="" />
                                </a>
                                <div class="rs-caption rs-bottom">
                                    <h3>Caption Area</h3>
                                    <p>Random text <a href="http://www.entiri.com/" class="button"> with link.</a></p>
                                </div>
                            </li>
                            <li>
                                <a href="#">
                                    <img src="img/shop-item-2.jpg" alt="" />
                                </a>
                                <div class="rs-caption rs-bottom">
                                    <h3>Caption Area</h3>
                                    <p>Random text <a href="http://www.entiri.com/" class="button"> with link.</a></p>
                                </div>
                            </li>
                        </ul>
                    </div> 
                </div>
                <div class="row spacer20"></div>
                <hr>
            </div> <!-- container end  -->
        </section>

        <!-- Footer -->
        <footer id="footer">

            <div class="container footer">
                <div class="row">
                    <div class="span4 offset4">
                        <div class="contact"><h3><a href="#">Contato</a></h3></div>
                        <div class="border-bottom"></div>
                    </div>
                </div>
                <div class="row spacer40"></div>
                <div class="row">
                    <div class="span3">
                        <div class="logo">
                            <a href="index-2.html"><div class="logo-picture"></div></a> <!-- Logo link and logo image -->
                        </div> 
                    </div>
                    <div class="span3">
                        <h4>GET IN TOUCH</h4>
                        <p>Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc. Claritas est etiam processus dynamicus.
                        </p>
                    </div>
                    <div class="span3">
                        <h4>ADDRESS</h4>
                        <p>2701 San Tomas Expressway<br>
                            Santa Clara, CA 95050<br>
                            Tel: 1+(408) 486-2000<br>
                            Fax: 1+(408) 486-2200<br>
                            <a href="mailto:exapmple@example.com">bruno.jovani@bruno.com</a>
                        </p>
                    </div>
                    <div class="span3">
                        <h4>FOLLOW US</h4>
                        <p>
                            <a href="#" class="social-icon-main"><i class="icon-facebook" title="facebook"></i></a>
                            <a href="#" class="social-icon-main"><i class="icon-google-plus" title="google +"></i></a>
                            <a href="#" class="social-icon-main"><i class="icon-twitter" title="twitter"></i></a> 
                            <a href="#" class="social-icon-main"><i class="icon-skype" title="skype"></i></a> 
                            <a href="#" class="social-icon-main"><i class="icon-linkedin" title="linkedin"></i></a>
                            <a href="#" class="social-icon-main"><i class="icon-dribbble" title="dribbble"></i></a>
                            <a href="#" class="social-icon-main"><i class="icon-pinterest" title="pinterest"></i></a>
                            <a href="#" class="social-icon-main"><i class="icon-flickr" title="flickr"></i></a>
                            <a href="#" class="social-icon-main"><i class="icon-tumblr" title="tumblr"></i></a>
                            <a href="#" class="social-icon-main"><i class="icon-youtube" title="youtube"></i></a>                                         
                        </p>          
                    </div>        
                </div>
            </div> <!-- row end -->
        </div> <!-- footer container end --> 
    </footer>
    <!-- Footer End -->

    <!-- Javascript -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/jquery.js"></script> 
    <script src="js/bootstrap.min.js"></script>
    <script src="js/jquery.easing.js"></script> 
    <script src="js/jquery.flexslider-min.js"></script>
    <script src="js/jquery.nivo.slider.pack.js"></script> 
    <script src="js/jquery.isotope.min.js"></script>
    <script src="js/jquery.mCustomScrollbar.concat.min.js"></script> 
    <script src="js/jquery.prettyPhoto.js"></script>    
    <script src="js/animate.js"></script>
    <script src="js/jquery.fitvids.js"></script>
    <script src="js/retina.js"></script>
    <script src="js/respond.min.js"></script>  
    <script src="js/jquery.parallax-1.1.3.js"></script>
    <script src="js/jquery.refineslide.js"></script>
    <script src="js/selectnav.js"></script>     
    <script src="js/functions.js"></script> 

</body>
</html>